<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

<!-- 
    传统的实现方式，将程序分到多个js文件中
    1.每个js中的全局代码容易发送命名冲突
    2.某些相同的业务逻辑不方便复用
    3.多个js文件之间的依赖关系容易混乱
 -->
<!-- <script src="./a4.js"></script>
<script src="./a1.js"></script>
<script src="./a5.js"></script>
<script src="./a6.js"></script>
<script src="./a2.js"></script>
<script src="./a3.js"></script> -->

<script>

// 前端模块化
// 模块化，就是将一个大程序拆分为多个小的功能，放在多个js文件中，每一个js文件就是一个模块
// 模块化的好处：
// 1.模块拥有独立的作用域(不会相互影响和覆盖)
// 2.模块方便阅读、维护、复用、团队协作

// ES6之前，官方并没有模块化规范！

// 开发社区中的模块化规范：

// Commonjs，后端的模块化规范，同步加载
// require()加载模块
// module.exports定义模块内容

// AMD，异步模块定义，前端模块化规范，异步加载
// AMD代表作是require.js模块载入框架，推崇依赖前置，提前执行（进口）
// require()加载模块
// define()定义模块内容

// CMD，通用模块定义，前端模块化规范，异步加载
// CMD代表作是Sea.js模块载入框架，推崇依赖就近，延迟执行（国产，玉伯）
// require()加载模块
// define()定义模块内容

// ES 模块
// ES6官方推出了 ES module 模块化语法规范，可以在前端和后端使用
// import 命令用于加载模块内容
// export 命令用于输出模块内容

</script>
</body>
</html>